import React, { Component } from 'react'
import PropTypes from 'prop-types'
import _ from 'loadsh'
import moment from 'moment'
import { TextLine, TextCell } from '@components/ApprovePre/Approve'
import style from './Style.module.less'
import { download } from '@js/downloadRename'
export default class StepTwoHistory extends Component {
  state = {
    keyTitleMap: {}
  }

  initKeyTitleMap () {
    const map = {}
    const list = _.get(this.props.action || {}, 'vars', [])
    list.forEach(li => {
      map[li.key] = li.title
    })
    this.setState({
      keyTitleMap: map
    })
  }

  formatDate (t) {
    if (!t) {
      return t
    }
    return moment(t * 1000).format('YYYY-MM-DD HH:mm')
  }

  componentDidUpdate (prev) {
    if (this.props.instance !== prev.instance) {
      this.initKeyTitleMap()
    }
  }

  componentDidMount () {
    this.initKeyTitleMap()
  }

  renderDoc (o) {
    if (!o) {
      return '无'
    }
    if (o.length === 0) {
      return '无'
    }
    let obj = o || []
    if (typeof obj === 'string') {
      try {
        obj = JSON.parse(obj)
        obj = obj.map(li => {
          li.original_filename = li.filename
          return li
        })
      } catch (e) {
        obj = []
        return ''
      }
    }
    return (
      <div className={style.files}>
        {
          obj.map((li, i) => {
            return <a className={style['file-down']} key={i} onClick={() => download(li.path, li.original_filename)}>{li.original_filename}</a>
          })
        }
      </div>
    )
  }

  render () {
    const { action } = this.props
    const { varsMap } = action
    const { keyTitleMap } = this.state
    return (
      <div>
        <TextLine>
          {
            keyTitleMap.other_fileid !== undefined && (
              <TextCell>
                <span>{keyTitleMap.other_fileid}：</span>
                {this.renderDoc((varsMap.other_fileid || {}).value)}
              </TextCell>
            )
          }
          {
            keyTitleMap.other_pdf_fileid !== undefined && (
              <TextCell>
                <span>{keyTitleMap.other_pdf_fileid}：</span>
                {this.renderDoc((varsMap.other_pdf_fileid || {}).value)}
              </TextCell>
            )
          }
          {
            keyTitleMap.document_sealtype !== undefined && (
              <TextCell>
                {keyTitleMap.document_sealtype}：{(varsMap.document_sealtype || {}).value}
              </TextCell>
            )
          }
        </TextLine>
        <TextLine>
          <TextCell style={{ width: '65%' }}>
            {keyTitleMap.liushuihao_remark}：{(varsMap.liushuihao_remark || {}).value}
          </TextCell>
        </TextLine>
        <TextLine>
          <TextCell style={{ width: '65%' }}>{action.remark_alias || '备注'}：{action.remark || '无'}</TextCell>
        </TextLine>
      </div>
    )
  }
}

StepTwoHistory.proptypes = {
  userInfo: PropTypes.object,
  instance: PropTypes.object,
  action: PropTypes.object,
  renderDocument: PropTypes.func,
  readDoc: PropTypes.func
}

StepTwoHistory.defaultProps = {
  userInfo: {},
  instance: {},
  action: {},
  renderDocument: () => { },
  readDoc: () => { }
}
